
<template>
  <div>
    <basic-container>
      <div class="khgl_menu">
        <div class="khgl-header">
          <el-tag type="danger">档案编号: {{jkdn.dnbh==''||jkdn.dnbh==undefined?'暂无信息':jkdn.dnbh}}</el-tag>
          <el-tag>姓名:{{jkdn.name==''||jkdn.name==undefined?'暂无信息':jkdn.name}}</el-tag>
          <el-tag>年龄:{{jkdn.age==''||jkdn.age==undefined?'暂无信息':jkdn.age}}</el-tag>
          <el-tag type='info'>手机号: {{jkdn.lxdh==''||jkdn.lxdh==undefined?'暂无信息':jkdn.lxdh}}</el-tag>
          <el-tag type="success">证件号: {{jkdn.sfzhm==''||jkdn.sfzhm==undefined?'暂无信息':jkdn.sfzhm}}</el-tag>
          <el-button @click="breaks"
                     size="small"
                     class="break">
            <i></i>返回</el-button>
        </div>
        <el-tabs v-model="activeName"
                 @tab-click="tabchange">
          <el-tab-pane name="jbxx1">
            <span slot="label">
              <i class="icon-jibenxinxi-xiugai">&nbsp;</i>基本信息</span>
          </el-tab-pane>
          <el-tab-pane name="jws1">
            <span slot="label">
              <i class="icon-icon-p_lishibaobiao">&nbsp;</i>既往史</span>
          </el-tab-pane>
          <el-tab-pane name="jkdn">
            <span slot="label">
              <i class="icon-jibenziliao_huaban">&nbsp;</i>健康档案</span>
          </el-tab-pane>
          <el-tab-pane name="health">
            <span slot="label">
              <i class="icon-tijianbaogao"> &nbsp;</i>健康体检</span>
          </el-tab-pane>
          <el-tab-pane name="oldShzlnl">
            <span slot="label">
              <i class="icon-navicon-jkpg">&nbsp;</i>老年人生活自理能力评估</span>
          </el-tab-pane>
          <el-tab-pane name="oldZyyjk">
            <span slot="label">
              <i class="icon-06">&nbsp;</i>老年人中医药健康管理服务记录</span>
          </el-tab-pane>
        </el-tabs>
      </div>
      <router-view class="khgl_content"></router-view>
    </basic-container>
  </div>
</template>

<script>
import { getStore } from '@/util/store'
export default {
  data () {
    return {
      where: false,
      grjbxxid: null,
      id: null,
      activeName: 'jbxx1',
      jkdn: getStore({ name: 'jkdn' })
    }
  },
  created () {
    this.$route.query.custId = this.$route.query.grjbxxid
    this.grjbxxid = this.$route.query.grjbxxid
    this.where = this.$route.query.where
    this.id = this.$route.params.id
    this.$router.push({
      path: `/cust/jkdn/${this.id}/jbxx1`,
      query: this.$route.query
    })
  },
  mounted () { },
  methods: {
    //返回
    breaks () {
      if (this.where) {
        this.$router.push({
          path: `/cust/jkdnMenu`,
          query: { grjbxxid: this.grjbxxid }
        })
      } else {
        this.$router.push('/cust/jkdnMenu')
      }
    },
    //tab切换
    tabchange (tab) {
      this.$route.query.custId = this.$route.query.grjbxxid
      var path = `/cust/jkdn/${this.id}/${tab.name}`
      this.$router.push({
        path: path,
        query: this.$route.query,
        replace: true
      })
    }
  },
  computed: {}
}
</script>

<style lang="scss" scoped>
.khgl-header {
  position: relative;
  width: 100%;
  padding: 0 0 5px 0;
  background: #fff;
  box-sizing: border-box;
  .el-tag {
    margin-right: 10px;
  }
}
.khgl_menu {
  padding: 10px 15px 0 15px;
  background: #fff;
  box-sizing: border-box;
}
.khgl_content {
  background: #fff;
  box-sizing: border-box;
  margin: 0 9px 30px 9px;
}
.break {
  position: absolute;
  top: 0;
  right: 0;
  letter-spacing: 2px;
  font-size: 14px;
  color: #20a0ff;
  cursor: pointer;
  z-index: 2;
}
.break:hover {
  color: #333;
}
</style>
